import MyUpload from '@/components/MyUpload';
import { getResult } from '@/services/sys/attribute';
import {
  editCategory,
  findByDataCategoryListPageSelect,
  findByDataCategoryListSelect,
} from '@/services/sys/MenuService';
import {
  ModalForm,
  ProForm,
  ProFormDigit,
  ProFormGroup,
  ProFormItem,
  ProFormSelect,
  ProFormSwitch,
  ProFormText,
} from '@ant-design/pro-components';
import { Button, message } from 'antd';
import React, { useEffect } from 'react';

interface Props {
  row: API.Category;
  onSuccess: () => void;
}

const request = () => {
  return new Promise<API.SelectItem[]>((resolve, reject) => {
    findByDataCategoryListSelect()
      .then((res) => {
        let selectItems = res;
        // @ts-ignore
        selectItems.unshift({ name: '下一单', label: '下一单', value: 0 });
        resolve(selectItems);
      })
      .catch((e) => {});
  });
};

const request1 = () => {
  return new Promise<API.SelectItem[]>((resolve, reject) => {
    findByDataCategoryListPageSelect()
      .then((res) => {
        let selectItems = res;
        // @ts-ignore
        selectItems.unshift({ name: '下一单', label: '下一单', value: '' });
        resolve(selectItems);
      })
      .catch((e) => {});
  });
};
const CategoryEdit: React.FC<Props> = (props) => {
  const { row, onSuccess } = props;
  const [form] = ProForm.useForm();
  useEffect(() => {
    form.setFieldsValue(row);
  }, [row]);
  return (
    <ModalForm<API.Category>
      initialValues={row}
      title="菜单管理"
      trigger={<Button type="primary">新增/编辑</Button>}
      onFinish={(values) => {
        // values.id = menuInfo.id;
        console.log(values);
        return new Promise<Boolean>((resolve, reject) => {
          editCategory(values)
            .then(() => {
              message.success('操作成功');

              //     refresh ();
              resolve(true);
              if (onSuccess) {
                onSuccess();
              }
              form.resetFields();
            })
            .catch(() => {
              message.success('操作失败');
              reject(false);
            });
        });
      }}
    >
      <ProFormText hidden={true} width="md" name="id" />
      <ProFormText hidden={true} width="md" name="imageId" />
      <ProFormGroup>
        <ProFormItem label={'图标'} name={'image'}>
          <MyUpload
            type={5}
            onChange={(imageId) => {
              form.setFieldValue('imageId', imageId);
            }}
          />
        </ProFormItem>
        <ProFormText width="md" name="name" label="汉语名称" />
      </ProFormGroup>
      <ProFormGroup>
        <ProFormText width="md" name="nameUg" label="维语名称" />
        <ProFormDigit width="md" name="sort" label="排水" />
      </ProFormGroup>
      <ProFormGroup>
        <ProFormSelect
          width="md"
          name="parentId"
          label="类型"
          request={() => {
            return getResult('advertisingTargetType', 1);
          }}
        />
        <ProFormSelect
          width="md"
          name="type"
          label="系统类型"
          request={() => {
            return getResult('frontSystemCategoryType', 1);
          }}
        />
        <ProFormSelect
          width="md"
          name="parentId"
          label="下一单"
          request={request}
        />
        <ProFormSelect width="md" name="path" label="地址" request={request1} />
      </ProFormGroup>
      <ProFormGroup>
        <ProFormText width="md" name="permission" label="权限字符" />
        <ProFormSwitch width="md" name="flagIcon" label="标题显示" />
      </ProFormGroup>
      <ProFormGroup>
        <ProFormSwitch width="md" name="flagTitle" label="图标显示" />
        <ProFormSwitch width="md" name="grid" label="Grid显示" />
      </ProFormGroup>

      <ProFormGroup>
        <ProFormDigit width="md" name="col" label="字段数" />
        <ProFormDigit width="md" name="size" label="Size" />
      </ProFormGroup>
    </ModalForm>
  );
};
export default CategoryEdit;
